<template>
  <view>
    <!-- #ifdef APP-PLUS-->
    <u-sticky offset-top="0">
      <!-- #endif -->
      <!-- #ifdef H5 -->
      <u-sticky offset-top="-44">
        <!-- #endif -->
        <view :style="{ height: tops + 'px' }"
              style="width: 100%;background:#fff"></view>
        <view class="comment_top">
          <view class="left"
                @click="toBack">
            <u-icon name="arrow-left"
                    size="20"
                    color="#333"></u-icon>
          </view>
          <view class="userInfo"
                @click="toMypage(detail)">
            <u--image :src="detail?.user_info?.avatar"
                      width="70rpx"
                      height="70rpx"
                      radius="50%">
              <template #error
                        class="flex-center-center">
                <view class="ic-error">
                  <u-icon name="photo"
                          size="20"></u-icon>
                </view>
              </template>
            </u--image>
            <view class="nickname">
              <view>
                {{ detail?.user_info?.nickname }}
              </view>
              <view class="user_tags">
                <image v-if="detail?.user_info?.app_user_tag=='official'"
                       src="https://ossresource.miyingbl.com/uploads/20240308/072661a99870e1fcfba1d1df6d8ddd35.png"></image>
                <image v-if="detail?.user_info?.app_user_tag=='doctor'"
                       src="https://ossresource.miyingbl.com/uploads/20240308/dbb99ae497e429ae87f740fb0f64a57f.png"></image>
                <text class="u-line-1 "
                      v-if="!(detail?.user_info?.identity_status_name=='未知'||detail?.user_info?.identity_status_name=='其他') && !detail?.user_info?.app_user_tag">{{detail?.user_info?.identity_status_name||forMatStatus(detail?.user_info?.identity_status)}}</text>
              </view>
            </view>

          </view>

          <view v-show="userInfo?.uid !== detail?.user_id">
            <view class="w_flw_btn"
                  v-if="detail.is_follow == 1"
                  @click="toFollow(detail)">已关注</view>
            <view class="flw_btn"
                  v-else
                  @click="toFollow(detail)">关注</view>
          </view>
          <!-- <view style="margin-right: 30rpx"
                @click="toDetail">
            <u-icon name="https://ossresource.miyingbl.com/def/cc2ee202405241442129212.png"
                    size="20"
                    color="#333"></u-icon>
          </view> -->
        </view>
      </u-sticky>

      <scroll-view scroll-y="true">
        <view style="border-bottom: 10rpx solid #f6f6f6"></view>

        <view class="pages">
          <view class="item_list"
                id="comm_box">
            <!--<view class="item_list_t" v-show="commScroll"></view>-->
            <view class="detailTitle"
                  v-if="detail?.title">{{detail?.title}}</view>
            <view class="item_list_c">
              <u-parse :previewImg="false"
                       :content="detail?.content"
                       :showImgMenu="false"
                       :selectable="false"
                       :lazyLoad="true"
                       @ready="parseReady"></u-parse>
            </view>
            <!-- 轮播 -->
            <view class="scroll-content"
                  v-if="detail?.link_url">
              <!-- v-if="detail?.post_type==0"-->
              <!-- 一张图 -->
              <view v-if="detail?.link_url.length == 1"
                    style="margin-top:20rpx">
                <image :src="image"
                       style='width:100%'
                       radius="12"
                       mode='widthFix'
                       @click="previewImg(detail?.link_url, i)"
                       v-for="(image, i) in detail.link_url">
                </image>
              </view>
              <!-- 两张图 四张图-->
              <view v-if="detail?.link_url.length == 2 || detail?.link_url.length == 4">
                <view class="scroll-content_img scroll-content_img1"
                      v-for="(image, i) in detail.link_url"
                      :key="i">
                  <u--image :src="image"
                            width="220rpx"
                            height="198rpx"
                            radius="12"
                            @click="previewImg(detail?.link_url, i)">

                    <template #error
                              class="flex-center-center">
                      <view class="ic-error">
                        <u-icon name="error-circle"
                                size="20"></u-icon>
                      </view>
                    </template>
                  </u--image>
                </view>
              </view>
              <!-- 三张图 大于四张图-->
              <view v-if="detail?.link_url.length == 3 || detail?.link_url.length > 4">
                <view class="scroll-content_img"
                      v-for="(image, i) in detail.link_url"
                      :key="i">
                  <u--image :src="image"
                            width="220rpx"
                            height="198rpx"
                            radius="12"
                            @click="previewImg(detail?.link_url, i)">

                    <template #error
                              class="flex-center-center">
                      <view class="ic-error">
                        <u-icon name="error-circle"
                                size="20"></u-icon>
                      </view>
                    </template>
                  </u--image>
                </view>
              </view>

            </view>
            <!--<view class="scroll-content" v-if="detail?.post_type==1">
						<video id="myVideo" v-for="(image, i) in detail?.image" :src="image" :key="i" @error="videoErrorCallback" controls></video>
					</view>-->
            <view class="time"> {{formatDate(detail?.create_time,'MM-DD HH:mm')}} <text style=""
                    v-if="detail.province">{{detail?.province||''}}</text></view>
          </view>
        </view>
        <view class="pages">
          <!-- 评论 -->
          <view class="comm_box">
            <view class="all"
                  v-if="commentList.length > 0">热门评论({{ detail?.comment_number?detail?.comment_number:0 }})</view>
            <view class="comment_boxc_more"
                  v-if="commentList.length == 0">
              <image src="https://ossresource.miyingbl.com/def/a7eed202405231608191269.png"
                     class='empty_image'></image>
              <view style="color: #ABABAB;margin-bottom: 50rpx;">
                暂无评论，快来发表你的评论吧
              </view>
            </view>
            <view class="comment"
                  v-for="(item, index) in commentList"
                  :key="index"
                  v-show="index<5">
              <view class="comment_box">
                <view class="comment_head">
                  <view class="comment_head_l"
                        @click.stop="toMypage(item)">
                    <u--image :src="item.avatar"
                              width="67rpx"
                              height="67rpx"
                              radius="50%">

                      <template #error
                                class="flex-center-center">
                        <view class="ic-error">
                          <u-icon name="photo"
                                  size="20"></u-icon>
                        </view>
                      </template>
                    </u--image>
                  </view>
                  <!-- 一级回复 -->
                  <view class="comment_head_r commentBorder"
                        @click="toCommenta(item, index)"
                        style="  padding-bottom: 10rpx;">
                    <view class="comment_nickname">
                      <view class="comment_head_r_name">
                        <text class="text-overflow-ep">{{ item.nickname || '匿名用户' }}</text>
                        <view class="user_tags">
                          <image v-if="item?.app_user_tag=='official' || item?.user_info?.app_user_tag=='official'"
                                 src="https://ossresource.miyingbl.com/uploads/20240308/072661a99870e1fcfba1d1df6d8ddd35.png">
                          </image>
                          <image v-if="item?.app_user_tag=='doctor' || item?.user_info?.app_user_tag=='doctor'"
                                 src="https://ossresource.miyingbl.com/uploads/20240308/dbb99ae497e429ae87f740fb0f64a57f.png">
                          </image>
                          <text class="u-line-1 "
                                v-if="!(item?.identity_status_name=='未知'||item?.identity_status_name=='其他') && (!item?.app_user_tag || !item?.user_info?.app_user_tag)">
                            {{item.identity_status_name||forMatStatus(item.identity_status)}}</text>
                        </view>
                      </view>
                      <!-- 点赞图标 -->
                      <view class="comment_box_zan"
                            @click.stop="praise(item)">
                       <image src="https://ossresource.miyingbl.com/def/9f361202405231506404750.png" class="icons"
                         v-if="item.is_zan == 1"></image>
                       <image src="https://ossresource.miyingbl.com/def/29cbd202405231506398795.png" class="icons" v-else>
                       </image>
                        <view class="comment_box_zan_num">
                          {{ item?.zan_number ? item?.zan_number : 0 }}
                        </view>
                      </view>
                    </view>
                    <view class="comment_ct_r_text"
                          @longpress="longpressCommenta(item, index,commentList)">
                      {{ item?.comment_text || '' }}
                    </view>
                    <view class="comment_ct_r_time">{{ item?.create_time || '' }} <text class="address">
                        {{item?.province}}</text><text>回复</text></view>

                    <view class="comment_boxc"
                          v-for="(items, indexs) in item.comment_list"
                          :key="indexs"
                          v-show="item.comment_list && indexs < 2"
                          @click.stop="toCommentb(items, index, false, indexs)">
                      <view class="comment_head">
                        <view class="comment_head_l"   @click.stop="toMypage(items)">
                          <u--image :src="items?.avatar"
                                    width="67rpx"
                                    height="67rpx"
                                    radius="50%">

                            <template #error
                                      class="flex-center-center">
                              <view class="ic-error">
                                <u-icon name="photo"
                                        size="20"></u-icon>
                              </view>
                            </template>
                          </u--image>
                        </view>
                        <!-- 二级回复 -->
                        <view class="comment_head_r">
                          <view class="comment_nickname">
                            <view class="comment_head_r_name">
                              <text class="text-overflow-ep">{{ items.nickname || '匿名用户'
                                                            }}</text>
                              <view class="user_tags">
                                <image v-if="items?.app_user_tag=='official'"
                                       src="https://ossresource.miyingbl.com/uploads/20240308/072661a99870e1fcfba1d1df6d8ddd35.png">
                                </image>
                                <image v-if="items?.app_user_tag=='doctor'"
                                       src="https://ossresource.miyingbl.com/uploads/20240308/dbb99ae497e429ae87f740fb0f64a57f.png">
                                </image>
                                <text class="u-line-1 "
                                      v-if="!(items?.identity_status_name=='未知'||items?.identity_status_name=='其他')  && !item?.app_user_tag">
                                  {{forMatStatus(items.identity_status)||items.identity_status_name}}</text>
                              </view>

                            </view>
                            <view class="comment_box_zan"
                                  @click.stop="praise(items)">
                                      <image src="https://ossresource.miyingbl.com/def/9f361202405231506404750.png" class="icons"
                                        v-if="items.is_zan == 1"></image>
                                      <image src="https://ossresource.miyingbl.com/def/29cbd202405231506398795.png" class="icons" v-else>
                                      </image>
                              <view class="comment_box_zan_num">
                                {{ items.zan_number ? items.zan_number : 0 }}
                              </view>
                            </view>
                          </view>
                          <view class="comment_ct_r_text"
                                @longpress="longpressCommenta(items, indexs,item.comment_list)">
                            <text v-if="items.to_user_name"> 回复<text style="color:#969696;padding-left:10rpx">{{items?.to_user_name}}：</text></text>{{ items.comment_text || '' }}
                          </view>
                          <view class="comment_ct_r_time">{{ items.create_time || '' }} <text class="address">
                              {{item?.province}}</text>
                            <text>回复</text>
                          </view>
                        </view>
                      </view>
                    </view>
                    <view class="comment_boxc"
                          v-for="(items, indexs) in item.comment_list"
                          :key="indexs"
                          v-show="indexs >= 2 && item.show"
                          @click.stop="toCommentb(items, index, false, indexs)">
                      <view class="comment_head">
                        <image class="comment_head_l"
                               :src="items.avatar || ''" @click.stop="toMypage(items)"/>
                        <view class="comment_head_r">
                          <view class="comment_nickname">
                            <view class="comment_head_r_name">
                              <text class="text-overflow-ep">{{ items.nickname || '匿名用户'
                                                            }}</text>
                              <view class="user_tags">
                                <image v-if="items?.app_user_tag=='official'"
                                       src="https://ossresource.miyingbl.com/uploads/20240308/072661a99870e1fcfba1d1df6d8ddd35.png">
                                </image>
                                <image v-if="items?.app_user_tag=='doctor'"
                                       src="https://ossresource.miyingbl.com/uploads/20240308/dbb99ae497e429ae87f740fb0f64a57f.png">
                                </image>
                                <text class="u-line-1 "
                                      v-if="item?.identity_status_name!='未知' && !item?.app_user_tag">
                                  {{forMatStatus(items.identity_status)||items.identity_status_name}}</text>
                              </view>
                            </view>
                            <view class="comment_box_zan"
                                  @click.stop="praise(items)">
                             <image src="https://ossresource.miyingbl.com/def/9f361202405231506404750.png" class="icons"
                               v-if="items.is_zan == 1"></image>
                             <image src="https://ossresource.miyingbl.com/def/29cbd202405231506398795.png" class="icons" v-else>
                             </image>
                              <view class="comment_box_zan_num">{{ items.zan_number }}</view>
                            </view>
                          </view>
                          <view class="comment_ct_r_text"
                                @longpress="longpressCommenta(items, indexs,item.comment_list)">
                            <text v-if="items.to_user_name"> 回复<text style="color:#969696;padding-left:10rpx">{{items.to_user_name}}：</text></text>
                            {{ items.comment_text || '' }}
                          </view>
                          <view class="comment_ct_r_time">{{ items.create_time || '' }} <text class="address">
                              {{item.province}}</text>
                            <text>回复</text>
                          </view>
                        </view>
                      </view>

                    </view>
                    <view class="comment_boxc_more comment_boxc_more1"
                          @click.stop="getMore(index)"
                          v-if="item.comment_list && item.comment_list.length > 2">
                      {{ item.show ? '收回' : '展开更多回复' }}
                    </view>
                  </view>
                </view>
              </view>
            </view>
            <view class="all_com_btn"
                  v-if="detail?.comment_number  > 5"
                  @click="navigateTo('/socials/comment/index?id=' + detail?.id + '&type=' + trends_type)">
              查看全部{{ detail?.comment_number }}条评论
            </view>
          </view>
          <u-popup :show="fenShow"
                   mode="bottom"
                   @close="close"
                   :round="10"
                   :closeable="true"
                   bgColor='#F6F6F6'>
            <view>
              <view class="fen_box_title">分享至</view>
              <view class="fen_box">
                <view class="fen_box_cen">
                  <button open-type="share"
                          class="fen_box_cen_l"
                          @click="toppicWxShare(detail)">
                    <image src="https://ossresource.miyingbl.com/uploads/20240307/1b8d3a17f569740d545b17facde7d718.png"
                           class="fen_box_cen_l_img"></image>
                    <view class="fen_box_cen_l_te">微信好友</view>
                  </button>
                  <button open-type="share"
                          class="fen_box_cen_l"
                          @click="toppicPyShare(detail)">
                    <image src="https://ossresource.miyingbl.com/uploads/20240307/9c488feb2f34a1588dd945dbcf5fec32.png"
                           class="fen_box_cen_l_img"></image>
                    <view class="fen_box_cen_l_te">朋友圈</view>
                  </button>
                </view>
                <view v-show="detail?.user_id != userInfo?.uid">
                  <u-line></u-line>
                </view>
                <view class="fen_box_cen">
                  <button class="fen_box_cen_l"
                          @click="lahei()"
                          v-show="detail?.user_id != userInfo?.uid">
                    <image src="https://ossresource.miyingbl.com/uploads/20240304/47f1b605729e5f10ac2f5bdf6a6d8817.png"
                           class="fen_box_cen_l_img"></image>
                    <view class="fen_box_cen_l_te">不喜欢</view>
                  </button>
                  <button class="fen_box_cen_l"
                          @click="toReport"
                          v-show="detail?.user_id != userInfo?.uid">
                    <image src="https://ossresource.miyingbl.com/uploads/20240304/5b14bb94eae78c1a45d0d58b8fecc0d5.png"
                           class="fen_box_cen_l_img"></image>
                    <view class="fen_box_cen_l_te">举报</view>
                  </button>
                </view>
              </view>
            </view>

          </u-popup>
        </view>
        <!-- 精选推荐 -->
       <!-- <u-gap height="5"
               bgColor="#f6f6f6"></u-gap> -->
        <!-- <view>
          <view class="jxcontent">精选内容</view>
          <h-hot-list @deleteArticle="deleteArticle"
                      :list="recommendList"
                      @itemTap="gotoDetail"
                      :border="true"
                      @updateList="updateList"
                      @share="share"
                      @toLogin="showLogin"></h-hot-list>
          <h-loading :show="showLoading"
                     :showMore="recommendList?.length"></h-loading>
        </view> -->
        <view class="footerkong"></view>
        <view class="footer">
          <view class="footer_input"
                @click="toCom()">
            <u-icon name='edit-pen'
                    size='20'
                    color='999999'></u-icon> <text style=";">我来评论</text>
          </view>
          <view class="footer_btn" @click="getHeight()">
            <image src="https://ossresource.miyingbl.com/def/bd0b5202405231502545151.png" class="icons"></image>
            <text class="u-p-l-10">{{ detail?.comment_number }}</text>
          </view>
          <view class="footer_btn" @click="onArticleOperate(detail,1)">
            <image src="https://ossresource.miyingbl.com/def/9f361202405231506404750.png" class="icons"
              v-if="detail.is_like"></image>
            <image src="https://ossresource.miyingbl.com/def/29cbd202405231506398795.png" class="icons" v-else>
            </image>
            <text class="u-p-l-5">{{ detail?.zan_number }}</text>
          </view>
          <view class="footer_btn" @click="onArticleOperate(detail,2)">
            <image src="https://ossresource.miyingbl.com/def/2cb00202405231506423239.png" class="icons"
              v-if="detail.is_collect"></image>
            <image src="https://ossresource.miyingbl.com/def/7165b202405231506414059.png" class="icons" v-else>
            </image>
            <text class="u-p-l-5">{{ detail?.collect_number }}</text>
          </view>
        </view>
      </scroll-view>
  </view>
  <!-- <BottomComment @articleCommentInputFocus="articleCommentInputFocus" :detail='detail'></BottomComment> -->
  <!-- 评论输入框 -->
  <TextareaComment ref="textareaCommentRef"
                   v-model:showInputPop="showInputPop"
                   @closeInputPop="closeInputPop"
                   @commentSuccess="commentSuccess"
                   :detail='detail'
                   :trends_type="trends_type"
                   :type="2">
  </TextareaComment>
  <h-login ref="login"></h-login>

  <u-popup :show="laheiShow"
           mode="bottom"
           @close="closeLafei"
           :round="10"
           :closeable="true"
           bgColor='#F6F6F6'>
    <view>
      <view class="fen_box">
        <view class="fen_box_cen">
          <view class="lh_box_cen_l"
                @click="negativeFeedback(1)">
            <image src="https://ossresource.miyingbl.com/uploads/20240307/f6b32f7b63ee1ecc427102897e0cde2c.png"
                   class="fen_box_cen_l_img"></image>
            <view class="fen_box_cen_l_te">不感兴趣</view>
          </view>
          <view class="lh_box_cen_l"
                @click="defriend()">
            <image src="https://ossresource.miyingbl.com/uploads/20240307/5210aee89f7a4118171e4be748182b1f.png"
                   class="fen_box_cen_l_img"></image>
            <view class="fen_box_cen_l_te">不喜欢作者</view>
          </view>
        </view>
      </view>
    </view>

  </u-popup>
  <!-- 分享 -->
  <h-share ref="shareRef"></h-share>
</template>

<script setup lang="ts">
import {formatDate} from '@/utils/index'
const laheiShow = ref(false)
const closeLafei = () => {
  laheiShow.value = false
}
const lahei = () => {
  fenShow.value = false
  laheiShow.value = true
}

import { navigateTo, showToast } from '@/utils'
import TextareaComment from '@/components/BottomComment/TextareaComment'
import { getHomeHotBottomListApi } from '@/services/my/user'
import { negativeFeedbackApi, blockUserApi } from '@/api/home'
import { ref, reactive, nextTick } from 'vue'
import { onLoad, onPullDownRefresh, onReachBottom, onReady, onPageScroll,onShow } from '@dcloudio/uni-app'
const login = ref(null) // 登录组件实例
import { checkMsg } from '@/api/baby'
import UniShare from '@/uni_modules/uni-share/js_sdk/uni-share.js'
import { useMemberStore, useSystemStore } from '@/stores'
import {
  getTrendsInfo,
  getTrendsComments,
  trendsComment,
  trendsZan,
  trendsCollect,
  trendsCommentDel,
} from '@/api/trends'
import { getCreateUser,coupeDetailsApi,coupeCommentsApi,followUserApi,articleOperateApi,trendCommentDelApi,trendCommentLikeApi  } from '@/api/social'
const toUser = ref('') //回复给谁
var detail = ref({ link_url: [],content:'' })
const uniShare = new UniShare()
var id = ref()
var dyId = ref('')
const tops = ref(0)
const store = useMemberStore()
const token = store?.token
var userInfo = ref({})
userInfo.value = store.userInfo
console.log(userInfo.value)
var commentList = ref([])
var scrollTop = ref(0)
var commScroll = ref(false)
var cenHeight = 0
var commentShow = ref(false)
var commShow = ref(false)
var upIndex = 0
var childIndex = 0
var commentText = ref('')
var commentPostText = ref('')
var upRow = ref({})
var child = ref({})
var commonId = ref('')
var isLoading = ref(false)
var fenShow = ref(false)
var trends_type = ref(null)
const registrationID = ref('')
const showLoading = ref(false)
onLoad(({ id, isCom, type }) => {
  id = id
  dyId.value = id
  commonId.value = id
  commScroll.value = isCom
  console.log(type)
  trends_type.value = type
  getDetail(id)
  addListener()
  getRecommend()
  let res = uni.getStorageSync('registerID')
  registrationID.value = res
})
onShow(()=>{
   getCom( )
})

function addListener() {
  uni.$on('update_num', (row) => {
    const index = recommendList.value.findIndex((item) => item.id == row.id)
    console.log(index)
    if (index != -1) {
      recommendList.value[index].is_like = row.is_like
      recommendList.value[index].is_collect = row.is_collect
      recommendList.value[index].zan_number = row.zan_number
      recommendList.value[index].comment_number = row.comment_number
    }
  })



  uni.$on('defriend', (row) => {
    const index = recommendList.value.findIndex((item) => item.id == row.id)
    if (index != -1) {
      recommendList.value.splice(index, 1)
    }
  })
}
// onPageScroll(({
//   scrollTop
// }) => {
//   if (scrollTop > 50) {
//     commScroll.value = true
//   } else {
//     commScroll.value = false
//   }
// })
var is_ios = ref(false)
uni.getSystemInfo({
  success: (e) => {
    is_ios.value = e.osName
  },
})
onReady(() => {
  uni.getSystemInfo({
    success: (e) => {
      console.log(e)
      tops.value = e.statusBarHeight
    },
  })
})

function toBack() {
  uni.$emit('view_num',detail.value)
  uni.navigateBack({
    delta: 1,
  })
}
function toMypage(item) {
  if (item?.user_info?.app_user_tag||item?.app_user_tag) {
    let app_user_tag=item?.user_info?.app_user_tag||item?.app_user_tag
     let uid=item?.uid||item?.user_id
    if(uid == userStore?.userInfo.uid){
      navigateTo(`/pages-users/my-page/index?is_self=0&uid=${uid}&type=dt&tag=${app_user_tag}`)
    }else {
      navigateTo(`/pages-users/my-page/official-doctor-home?is_self=0&uid=${uid}&type=dt&tag=${app_user_tag}`)
    }
  } else {
    navigateTo(`/pages-users/my-page/other-index?is_self=0&uid=${uid}&type=dt&tag=${app_user_tag}`)
  }
}
function getMore(index) {
  commentList.value[index].show = !commentList.value[index].show
}
// 分享
function toppicWxShare(row) {
  /* #ifdef H5 */
  uni.showToast({
    icon: 'error',
    title: '暂不支持分享',
  })
  /* #endif */
  /* #ifdef APP-PLUS */

  uni.share({
    provider: 'weixin',
    type: 0,
    scene: 'WXSceneSession',
    href: `https://weappdev.miyingbl.com/download/index.html?path=/socials/detail/index&id=${row.id}`,
    title: '话题详情',
    summary: detail?.value.content,
    imageUrl: detail?.value.link_url[0],
    success: (res) => {
      uni.showToast({
        title: '分享成功',
        icon: 'success',
      })
      uni.hideLoading()
      fenShow.value = false
    },
    fail: (err) => {
      uni.showToast({
        title: '分享失败',
        icon: 'none',
        duration: 2000,
      })
      fenShow.value = false
      uni.hideLoading()
    },
  })
  /* #endif */
}

// 分享到朋友圈
function toppicPyShare(row) {
  /* #ifdef H5 */
  uni.showToast({
    icon: 'error',
    title: '暂不支持分享',
  })
  /* #endif */
  /* #ifdef APP-PLUS */

  uni.share({
    provider: 'weixin',
    type: 0,
    scene: 'WXSceneTimeline',
    href: `https://weappdev.miyingbl.com/download/index.html?path=/socials/detail/index&id=${row.id}`,
    title: '咪婴话题动态详情',
    summary: detail?.value.content,
    imageUrl: detail?.value.link_url[0],
    success: (res) => {
      uni.showToast({
        title: '分享成功',
        icon: 'success',
      })
      fenShow.value = false
      uni.hideLoading()
    },
    fail: (err) => {
      uni.showToast({
        title: '分享失败',
        icon: 'none',
        duration: 2000,
      })
      fenShow.value = false
      uni.hideLoading()
    },
  })
  /* #endif */
}

// 打开分享
function toDetail() {
  if (!store.token) return login.value.open()
  detail.value.summary = detail.value?.content

  detail.value.content_type='dt'
  detail.value.imageUrl =
  detail.value?.thumbnail ||
      'https://ossresource.miyingbl.com/uploads/20240407/01ee3354aaba5358383f38331eec8fec.png'
      detail.value.path = `socials/detail/index?id=${detail.value.id}`
  shareRef.value.open(detail.value)

  // fenShow.value = true
}
const recommendList = ref([]) //推荐列表
const equipment = ref('')
const userStore = useMemberStore()
const system = useSystemStore()
const pageRecommend = ref(0)
const getRecommend = () => {
  // #ifdef H5
  equipment.value = 'h5'
  // #endif
  let identity
  showLoading.value = true
  if (token) {
    // 登录后用返回的
    identity =
      userStore?.userInfo?.user?.identity_status || userStore?.casualUser?.identity_status || 0
  } else {
    // 没登录用存本地
    identity = userStore?.casualUser?.identity_status || 0
  }
  getHomeHotBottomListApi({
    imei: equipment.value || '',
    long: system.location.longitude || '',
    lat: system.location.latitude || '',
    identity_status: identity,
    type: 'dt',
    page: pageRecommend.value,
  }).then((res) => {
    if (res.data && Array.isArray(res.data)) {
      res.data.forEach((item) => {
        if (item?.content.length > 36) {
          item.content = item?.content.slice(0, 36)
          item.showAll = true
        }
      })
      recommendList.value = recommendList.value.concat(res.data)
    }
    showLoading.value = false
  })
}
// 负反馈

const negativeFeedback = (tab) => {
  negativeFeedbackApi({
    id: detail.value.id,
    type: 1, //动态 1
    tab: tab,
  }).then((res) => {
    uni.showToast({
      title: res.msg,
      icon: 'none',
    })
    laheiShow.value = false
    uni.$emit('defriend', detail.value)
  })
}

// 拉黑作者
function defriend() {
  laheiShow.value = false
  uni.showModal({
    title: '温馨提示',
    content: '您确定要拉黑该用户吗？',
    showCancel: true,
    success: function (res) {
      if (res.confirm) {
        blockUserApi({ to_uid: detail.value.user_id }).then((result) => {
          uni.setStorageSync('dle', detail.value.id)
          negativeFeedback(2)
        })
      } else if (res.cancel) {
        console.log('用户点击取消')
      }
    },
  })
}

const longpressCommenta = (row, index, list) => {
  console.log(list)
  if (row.user_id == userInfo.value.uid) {
    uni.showModal({
      title: '温馨提示',
      content: '您确定要删除此条评论吗？',
      showCancel: true,
      success: (res) => {
        if (res.confirm) {
          trendsCommentDel({
            id: row.id,
          }).then((result) => {
            if (result.code == 200) {
              list.splice(index, 1)
              uni.showToast({
                title: result.msg,
                icon: 'none',
              })
            } else {
              uni.showToast({
                title: result.msg,
                icon: 'none',
              })
            }
          })
        }
      },
    })
  }
}

function close() {
  commentShow.value = false
  commShow.value = false
  fenShow.value = false
}

function toCom() {
  if (!token) {
    login.value.open()
    return false
  } else {
    articleCommentInputFocus(1)
  }
}

function previewImg(list, index) {
  uni.previewImage({
    urls: list,
    current: index,
    fail: (err) => {
      console.log(err)
    },
  })
}

function toReport() {
  fenShow.value = false
  uni.navigateTo({
    url: '/pageT/report?id=' + dyId.value + '&type=6',
  })
}

async function toFollow(row) {
  if (!token) {
    login.value.open()
    return false
  }
  const res = await followUserApi({
    to_uid: row.user_id,
  })
  if (row.is_follow == 1) {
    row.is_follow = 0
  } else {
    row.is_follow = 1
  }
  uni.showToast({
    title: res.message,
    icon: 'none',
  })
  uni.$emit('followUser', { uid: row.user_id })
}

function videoErrorCallback(e) {
  uni.showModal({
    content: e.target.errMsg,
    showCancel: false,
  })
}
async function getDetail(id) {
  const res = await coupeDetailsApi({

      article_id: dyId.value,
      type:1
    // equipment:registrationID.value
  })
  if(!res.data) return
  detail.value = res?.data
  detail.value.content = res?.data?.content?.replace(/\n/g, '<br>')
  detail.value.is_like = res.data.is_zan
  if (res?.data?.province) {
    let str = res?.data?.province
    if (str.slice(-1) == '省') {
      detail.value.province = str.slice(0, str.length - 2)
    }
  }

  setTimeout(() => {
    if (res.data.link_url.length != 1) {
      getHeight()
    }
  }, 100)
}

function getHeight() {
  uni
    .createSelectorQuery()
    .select('#comm_box')
    .boundingClientRect((rect) => {
      console.log('================', rect)
      var num = rect.height
      cenHeight = num
      if (commScroll.value) {
        autoScroll(num)
      }
    })
    .exec()
}
function showLogin() {
  nextTick(() => {
    login.value.open()
  })
}

function autoScroll(height) {
  console.log('================', height)
  setTimeout(() => {
    uni.pageScrollTo({
      scrollTop: height,
      duration: 300,
    })
  })
  scrollTop.value = cenHeight
}

function parseReady(e) {
  getHeight()
}

function listScroll(e) {
  var num = Number(cenHeight) - 50
  if (e.detail.scrollTop > num) {
    commScroll.value = true
  } else {
    commScroll.value = false
  }
}
const params = ref({
  page: 1,
  limit: 10,
})
const finished = ref(false)
const total = ref()
const last_page = ref(0)
async function getCom( ) {
  if (finished.value) return
  const ress = await coupeCommentsApi({
    id:  dyId.value ,
    ...params.value,
    type:1
  })
  commentList.value =
    params.value.page == 1 ? ress.data.data : commentList.value.concat(ress.data.data)
  total.value = ress.data.total
  last_page.value = ress.data.last_page
}
const RecommendLimit = ref(10) //推荐每页条数
onReachBottom(() => {
  pageRecommend.value++
  getRecommend()
})

function follow(row, i) {
  recommendList.value[i].is_follow = recommendList.value[i].is_follow ? 0 : 1
}

function gotoDetail(row) {
  navigateTo(
    `${row.content_type == 'dt' ? '/socials/detail/index' : '/baby/science/index'}?&id=${row.id}`,
    0,
  )
}

// 评论》点赞
async function praise(row) {
  if (!token) {
    login.value.open()
    return false
  }
  const res = await trendCommentLikeApi({
    id: detail.value.id, //动态id
    comment_id: row.id, //目标id
    type: trends_type.value,
  })
  if (res.msg == '自己就不用给自己点赞了哈~') {
    // 给自己评论
    uni.showToast({
      title: res.msg,
      icon: 'none',
    })
  } else {
    if (row.is_zan == 1) {
      row.zan_number--
      row.is_zan = 0
      uni.showToast({
        title: res.message,
        icon: 'none',
      })
    } else {
      uni.showToast({
        title: res.message,
        icon: 'none',
      })
      row.zan_number++
      row.is_zan = 1
    }
  }
}
// 点赞  收藏
 async function onArticleOperate(row,type){
    if (!token) {
      login.value.open()
      return false
    }
    let res=await articleOperateApi({
      article_id: row.id,
      type,
      tab:1
    })
    if(res.code==200){
      if(type==1){
        if (row.is_like == 1) {
          row.is_like = 0
          row.zan_number--
        } else {
          row.is_like = 1
          row.zan_number++
        }
      }

      if(type==2){
        if (row.is_collect == 1) {
          row.is_collect = 0
          row.collect_number--
        } else {
          row.is_collect = 1
          row.collect_number++
        }
      }
      type==1?row.taptype = 'is_like':row.taptype = ' '
      uni.$emit('update_num', row)
      uni.setStorageSync('socialDetail', row)
    }
    uni.showToast({
      title: res.message,
      icon: 'none',
    })
  }
// 回复一级评论
function toCommenta(row, index, str = '') {
  if (!token) {
    login.value.open()
    return false
  }
  articleCommentInputFocus(2, row)
  upRow.value = row
  upIndex = index
  child.value = ''
  childIndex = ''
}
// 回复二级评论
function toCommentb(row, index, isChild, childIndex) {
  if (!token) {
    login.value.open()
    return false
  }
  articleCommentInputFocus(2, row)
  upRow.value = row
  upIndex = index
  child.value = isChild
  childIndex = childIndex
  if (!isChild) {
    commentShow.value = true
  }
}

const commentSuccess = ({ type, content, id }) => {
  console.log(type, content)
  if (type == 1) {
    // 发表评论
    commentList.value.unshift({
      comment_text: content,
      create_time: '刚刚',
      avatar: userInfo.value.avatar,
      nickname: userInfo.value.name,
      show_btn: true,
      comment_list: [],
      zan_number: 0,
      is_zan: 0,
      user_id: userInfo.value.uid,
      app_user_tag:'doctor',
      identity_status: userInfo.value.identity_status,
      province: system?.location?.province || '',
      id,
    })
    // console.log('userInfo.value',userInfo.value);

    // console.log('userInfo.value.app_user_tag',userInfo.value.app_user_tag);

    // console.log('commentList',commentList.value);

    detail.value.comment_number++
    total.value++
    uni.setStorageSync('socialDetail', upRow.value)
    getHeight()
    uni.$emit('update_num', detail.value)
  } else {
    // 回复评论
    commentList.value[upIndex].comment_list.unshift({
      comment_text: content,
      avatar: userInfo.value.avatar,
      create_time: '刚刚',
      to_user_name: upRow.value.nickname,
      p_nickname: upRow.value.nickname,
      nickname: userInfo.value.name,
      app_user_tag: 'doctor',
      p_uid: upRow.value.uid,
      user_id: userInfo.value.uid,
      comment_num: 0,
      show_btn: true,
      comment: [],
      zan_number: 0,
      is_zan: 0,
      comment_id: upRow.value.id,
      // app_user_tag: userInfo.value.app_user_tag,
      identity_status: userInfo.value.identity_status,
      province: system?.location?.province || '',
      id,
    })
    detail.value.comment_number++
    console.log(detail.value)
    uni.$emit('update_num', detail.value)
  }
}

// 评论输入框组件
const textareaCommentRef = ref()

// 新建评论弹窗
const showInputPop = ref(false)

// 文章评论聚焦
const articleCommentInputFocus = (type: number, e?: CommentRootList) => {
  showInputPop.value = true
  nextTick(() => {
    textareaCommentRef.value && textareaCommentRef.value.inputFocus(type, e)
  })
}

async function deleteArticle(params, index) {
  console.log('删除文章', params.id)
  const res = await negativeFeedbackApi({
    id: params.id,
    type: params.content_type == 'dt' ? 1 : 2,
    tab: 1, //不感興趣
  })
  showToast(res.msg)
  if (res.code == 0) {
    recommendList.value.splice(index, 1)
  }
}

// 关闭输入框
const closeInputPop = () => {
  showInputPop.value = false
}

function forMatStatus(status) {
  let text = ''
  switch (status) {
    case 0:
      text = ''
      break
    case 1:
      text = '记经期'
      break
    case 2:
      text = '备孕中'
      break
    case 3:
      text = '怀孕中'
      break
    case 4:
      text = '宝宝已出生'
      break
    case 5:
      text = '未婚'
      break
    case 6:
      text = '准爸'
      break

    case 7:
      text = '爸爸'
      break
    case 8:
      text = '生产育儿'
      break
    case 9:
      text = '慢病'
      break
    case 10:
      text = ''
      break
  }
  return text
}
function updateList(row, i, key) {
  recommendList.value[i][key] = recommendList.value[i][key] ? 0 : 1
  if (recommendList.value[i][key] == 0) {
    recommendList.value[i].zan_number--
  } else {
    recommendList.value[i].zan_number++
  }
}

const shareRef = ref(null)
function share(item) {
  if (!token) {
    login.value.open()
    return
  }
  if (item.content_type == 'kp') {
    item.path = `baby/science/index?id=${item.id}`
    item.imageUrl =
      item?.thumbnail ||
      'https://ossresource.miyingbl.com/uploads/20240407/01ee3354aaba5358383f38331eec8fec.png'
  } else {
    item.summary = item?.content
    item.imageUrl =
      item?.thumbnail ||
      'https://ossresource.miyingbl.com/uploads/20240407/01ee3354aaba5358383f38331eec8fec.png'
    item.path = `socials/detail/index?id=${item.id}`
  }
  shareRef.value.open(item)

}
</script>
<style>
page {
  background: #fff;
}
</style>
<style lang="scss" scoped>
.comment_top {
  display: flex;
  padding: 30rpx 0 24rpx;
  background: #fff;
  align-items: center;

  .left {
    padding: 0 14rpx;
  }

  .userInfo {
    display: flex;
    align-items: center;
    flex: 1;

    .nickname {
      font-family: PingFang SC, PingFang SC;
      padding-left: 10rpx;
      font-weight: 500;
      font-size: 28rpx;
      color: #000000;
    }
  }

  .flw_btn {
    background: #00C1B9;
    border-radius: 60rpx 60rpx 60rpx 60rpx;
    font-size: 26rpx;
    color: #fff;
    line-height: 56rpx;
    margin-right: 30rpx;
    width: 110rpx;
    text-align: center;
  }

  .w_flw_btn {
    background: #ffffff;
    border-radius: 60rpx 60rpx 60rpx 60rpx;
    border: 1rpx solid #00C1B9;
    line-height: 43rpx;
    margin-right: 30rpx;
    font-size: 26rpx;
    color: #00C1B9;
    width: 110rpx;
    text-align: center;
  }
}

.con_list_btn_l_text {
  font-size: 28rpx;
  color: #333;
}

.uni-navbar__header-container {
  overflow: auto;
}

.header {
  overflow: hidden;
  padding: 10rpx 0;
  background: #fff;
  z-index: 1000000;
}

.head_img {
  width: 40rpx;
  height: 40rpx;
  float: left;
  margin: 16rpx 25rpx;
}

.head_cen {
  float: left;

  .head_cen_img {
    width: 72rpx;
    height: 72rpx;
    border-radius: 50%;
    float: left;
  }

  .head_cen_name {
    float: left;
    line-height: 72rpx;
    margin: 0 10rpx;
  }
}

.head_cen_guan {
  float: left;
  height: 40rpx;
  border: 1rpx solid #0074fc;
  line-height: 38rpx;
  border-radius: 20rpx;
  text-align: center;
  margin: 15rpx 0;
  padding: 0 15rpx;
  font-size: 26rpx;
}

.head_title {
  text-align: center;
  line-height: 72rpx;
  float: left;
  width: 550rpx;
}

.pages {
  padding: 0 30rpx 15rpx;
  box-sizing: border-box;

  .item_list {
    width: 690rpx;
    background: #ffffff;
    box-sizing: border-box;
    padding-bottom: 20rpx;
    padding-top: 10rpx;
    border-bottom: 2rpx solid #e6e6e6;

    .time {
      font-family: PingFang SC, PingFang SC;
      font-weight: 500;
      font-size: 26rpx;
      color: #AAAAAA;
      // letter-spacing: 2px;
      padding-top: 15rpx;
    }

    .item_list_t {
      overflow: hidden;
      height: 112rpx;
      padding: 20rpx 0;

      .item_list_t_img {
        float: left;
        width: 72rpx;
        height: 72rpx;
        border-radius: 50%;
        margin-right: 20rpx;
      }

      .item_list_t_title {
        font-size: 28rpx;
        font-family: PingFang SC-Medium, PingFang SC;
        font-weight: 500;
        color: #999999;
        line-height: 72rpx;
        margin: 0 20rpx;
        float: left;
      }
    }

    .item_list_c {
      font-size: 28rpx;
      font-family: PingFang SC-Medium, PingFang SC;
      font-weight: 500;
      color: #333333;
      line-height: 1.5;
      padding-top: 15rpx;
    }

    .item_list_i {
      padding-top: 20rpx;
      display: flex;
      flex-wrap: wrap;
      justify-content: space-between;

      .item_list_t_img {
        width: 207rpx;
        height: 186rpx;
        border-radius: 6rpx;
      }
    }
  }
}

.head_icon_img {
  width: 50rpx;
  height: 10rpx;
  margin: 30rpx;
  float: right;
}

.image-list {
  width: 100%;
  margin: 22rpx 0;

  .scroll-content {
    .ic-error {
      width: 100%;
      padding-left: 77rpx;
      font-size: 28rpx;
      display: flex;
    }
  }

  ::v-deep .u-transition {
    margin-right: 20rpx;
  }
}

.scroll-content {
  overflow: hidden;
  padding-top: 0;
}

.scroll-content_img {
  width: 216rpx;
  height: 198rpx;
  margin-right: 20rpx;
  margin-top: 20rpx;
  float: left;
}

.scroll-content_img:nth-of-type(3n) {
  margin-right: 0;
}

.scroll-content_img1:nth-of-type(2n) {
  margin-right: 100px;
}

.scroll-content_img1:nth-of-type(3n) {
  margin-right: 20rpx;
}

.comm_box {
  // min-height: 100vh;

  .all {
    font-family: PingFang SC, PingFang SC;
    font-weight: 500;
    font-size: 28rpx;
    color: #000000;
    padding-top: 35rpx;
  }
}

.comment {
  width: 100%;
  padding-top: 24rpx;
  box-sizing: border-box;

  .comment_box {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;

    .comment_head {
      width: 100%;
      display: flex;
      flex-wrap: wrap;
      justify-content: space-between;

      .comment_head_l {
        width: 62rpx;
        height: 62rpx;
        border-radius: 50%;
      }

      .comment_head_r {
        width: 610rpx;

        &.commentBorder {
          border-bottom: 1rpx solid #e6e6e6;
          // &:nth-last-child(1){
          //   border:none
          // }
        }

        .comment_nickname {
          display: flex;
          align-items: center;
        }

        .comment_head_r_name {
          font-size: 28rpx;
          font-family: PingFang SC-Medium, PingFang SC;
          font-weight: 500;
          color: #333333;
          flex: 1;
          align-items: center;
        }

        .comment_ct_r_text {
          font-size: 28rpx;
          font-family: PingFang SC-Medium, PingFang SC;
          font-weight: 500;
          color: #333333;
          line-height: 40rpx;
          margin-top: 10rpx;
          width: 504rpx;
        }

        .comment_ct_r_time {
          font-size: 22rpx;
          font-family: PingFang SC-Medium, PingFang SC;
          font-weight: 500;
          color: #999;
          line-height: 33rpx;
          padding-top: 5rpx;

          text {
            color: #333333;
            margin-left: 10rpx;
            font-size: 26rpx;
          }

          .address {
            font-size: 22rpx;
            color: #999;
            margin-left: 5rpx;
            margin-right: 15rpx;
          }
        }
      }
    }
  }

  .comment_boxc {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    padding: 15rpx 0 0 0;
    width: 100%;

    .comment_head {
      display: flex;
      flex-wrap: wrap;
      justify-content: space-between;
      width: 610rpx;

      .comment_head_l {
        width: 62rpx;
        height: 62rpx;
        border-radius: 50%;
      }

      .comment_head_r {
        width: 530rpx;

        .comment_head_r_name {
          font-size: 24rpx;
          font-family: PingFang SC-Medium, PingFang SC;
          font-weight: 500;
          color: #333333;
          // display: flex;
        }

        .comment_ct_r_text {
          font-size: 26rpx;
          font-family: PingFang SC-Medium, PingFang SC;
          font-weight: 500;
          color: #333333;
          line-height: 1.5;
        }

        .comment_ct_r_time {
          font-size: 22rpx;
          font-family: PingFang SC-Medium, PingFang SC;
          font-weight: 500;
          color: #999;
          line-height: 33rpx;

          text {
            color: #333333;
            margin-left: 10rpx;
          }
        }
      }
    }
  }

  .comment_box_zan {
    text-align: right;

    .comment_box_zan_img {
      width: 40rpx;
      height: 40rpx;
    }

    .comment_box_zan_num {
      font-weight: 500;
      font-size: 22rpx;
      color: #333333;
      text-align: center;
    }
    .icons{
      width:28rpx;
      height:28rpx;
      display:block;
    }
  }

  &:nth-last-child(1) {
    .comment_box .comment_head .comment_head_r.commentBorder {
      border: none;
    }
  }
}


.comment_boxc_more {
 font-weight: 400;
 font-size: 26rpx;
 color: #AAAAAA;
  text-align: center;
  padding-top:20rpx;

  .empty_image {
    width: 240rpx;
    height: 220rpx;
    margin-top: 100rpx;
  }
}

.comment_boxc_more1 {
  font-family: PingFang SC, PingFang SC;
  font-weight: 500;
  font-size: 28rpx;
  color: #00C1B9;
  text-align: left;
  padding-left: 82rpx;
}

.all {
  font-size: 26rpx;
  font-family: PingFang SC, PingFang SC;
  font-weight: 500;
  color: #333333;
  line-height: 36rpx;
  padding: 20rpx 0;
}
.footerkong {
  padding: 26rpx 30rpx;
  height: 58rpx;
  padding-bottom: calc(30rpx + constant(safe-area-inset-bottom)); ///兼容 IOS<11.2/
  padding-bottom: calc(30rpx + env(safe-area-inset-bottom)); ///兼容 IOS>11.2/
  box-sizing: content-box;
}
.footer {
    width: 100%;
    box-sizing: border-box;
    padding: 15rpx 25rpx;
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    position: fixed;
    bottom: 0;
    left: 0;
    background: #fff;
    padding-bottom: calc(30rpx + constant(safe-area-inset-bottom)); ///兼容 IOS<11.2/
    padding-bottom: calc(30rpx + env(safe-area-inset-bottom)); ///兼容 IOS>11.2/
    z-index: 999;

    .footer_input {
      width: 362rpx;
      height: 70rpx;
      line-height: 70rpx;
      background: #F5F6F8;
      border-radius: 70rpx;
      text-align: left;
      font-size: 26rpx;
      font-family: PingFang SC-Medium, PingFang SC;
      font-weight: 500;
      color: #999999;
      padding-left: 10rpx;
      box-sizing: border-box;
      display: flex;
      align-items: center;
    }

    .footer_btn {
      text-align: center;
      display: flex;
      flex-wrap: wrap;
      justify-content: space-between;
      align-items:center;
      image {
        width: 28rpx;
        height: 28rpx;
        display:block;
        margin-right:10rpx;
      }

      text {
        font-size: 26rpx;
        font-family: PingFang SC-Regular, PingFang SC;
        font-weight: 400;
        color: #000000;
        line-height: 58rpx;
      }
    }
  }
.footera {
  width: 100%;
  box-sizing: border-box;
  padding: 30rpx;
  display: flex;
  justify-content: space-between;
  background: #fff;
  box-shadow: 0rpx -2rpx 7rpx 0rpx rgba(0, 0, 0, 0.09);
  box-sizing: border-box;

  .footer_input {
    width: 558rpx;
    height: 154rpx;
    border-radius: 18rpx;
    border: 1rpx solid #e6e6e6;
    font-size: 26rpx;
    font-family: PingFang SC-Regular, PingFang SC;
    font-weight: 400;
    color: #999999;
    box-sizing: border-box;
    padding: 20rpx;
    background: #f2f2f2;
    border: none;
  }

  .send-btn {
    width: 111rpx;
    height: 50rpx;
    background: #00C1B9;
    border-radius: 36rpx;
    font-size: 28rpx;
    font-family: PingFang SC-Medium, PingFang SC;
    font-weight: 500;
    color: #ffffff;
    line-height: 50rpx;
    text-align: center;
    margin: 0;
  }
}

.fen_box_title {
  text-align: center;
  font-size: 32rpx;
  font-family: PingFang SC, PingFang SC;
  font-weight: 500;
  color: #333333;
  line-height: 90rpx;
  height: 90rpx;
}

.fen_box {
  width: 100%;
  border-radius: 10rpx 10rpx 0 0;
  padding: 0 24rpx 24rpx;

  .fen_box_cen {
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-start;
    padding-top: 20rpx;

    .fen_box_cen_l {
      text-align: center;
      width: 150rpx;
      margin: 0;
      line-height: 1;
      background-color: transparent !important;

      &::after {
        background: transparent !important;
      }

      .fen_box_cen_l_img {
        width: 100rpx !important;
        height: 100rpx !important;
        border-radius: 50%;
      }

      .fen_box_cen_l_te {
        font-size: 28rpx;
        font-family: PingFang SC, PingFang SC;
        font-weight: 500;
        color: #333333;
        line-height: 80rpx;
      }
    }

    .lh_box_cen_l {
      width: 216rpx;
      padding: 10rpx 0 15rpx;
      background: #ffffff;
      border-radius: 14rpx 14rpx 14rpx 14rpx;
      text-align: center;
      margin: 10rpx 20rpx;
      font-weight: 500;
      font-size: 24rpx;
      color: #333333;

      image {
        width: 75rpx;
        height: 75rpx;
        display: block;
        margin: 0 auto;
      }
    }
  }
}

.all_com_btn {
  width: 298rpx;
  height: 60rpx;
  border-radius: 42rpx 42rpx 42rpx 42rpx;
  border: 2rpx solid #00C1B9;
  font-family: PingFang SC, PingFang SC;
  font-weight: 500;
  font-size: 28rpx;
  color: #00C1B9;
  line-height: 60rpx;
  text-align: center;
  margin: 30rpx auto 10rpx;
}

.jxcontent {
  padding: 30rpx 48rpx 0;
  font-family: PingFang SC, PingFang SC;
  font-weight: 500;
  font-size: 30rpx;
  color: #000000;
  text-align: left;
  margin-bottom: 20rpx;
}

.user_tags {
  display: flex;
  align-items: center;

  text {
    font-family: PingFang SC, PingFang SC;
    font-weight: 500;
    font-size: 22rpx;
    color: #969696;
    margin-right: 10rpx;
  }

  image {
    width: 113rpx;
    height: 27rpx;
    display: block;
    margin-right: 10rpx;
  }
}
.detailTitle {
  font-weight: 600;
  font-size: 30rpx;
  color: #333333;
  padding-top: 20rpx;
}
</style>
